<template lang="html">
  <div class="global">
    <div class="content">
      <!-- <p class="top">支付剩余时间 19:34</p> -->
      <span class="amount">￥{{payAmount}}</span>
    </div>
    <div class="method">
      <span class="top">支付方式</span>
      <image class="left" src="http://fanglilai-pic.oss-cn-shenzhen.aliyuncs.com/mw690/20180607/2018060708533768867.jpg"></image>
      <span class="mid">微信支付</span>
      <div @click="choose" class="right" :class="{ 'isActive' : active }"></div>
    </div>
    <div class="footer">
      <div @click="toPay" class="btn" :class="{ 'isLight' : btnLight }">确认支付 <span v-if="active">￥{{payAmount}}</span></div>
    </div>
  </div>
</template>

<script>
import api from '@/utils/api'
import md5 from 'js-md5'
import store from '@/store/store'
export default {
  data () {
    return {
      payAmount: 0,
      active: false,
      btnLight: false,
      unionPay: {},
      unionpaymakeorder: {},
      configwechatpay: {},
      openid: ''
    }
  },
  computed: {
    bids () {
      return store.state.bids
    }
  },
  onShow () {
    let bid = ''
    let attach = ''
    this.active = false
    this.btnLight = false
    this.payAmount = 0
    this.payAmount = parseFloat(this.$root.$mp.query.payAmount)
    console.log(this.bids)
    bid = this.bids.split(',')[0]
    attach = this.bids.replace(/,/g, '_')
    console.log(attach)
    this.opgetconfigwechatpayxcx()
    try {
      var value = wx.getStorageSync('openid')
      if (value) {
        console.log(value)
        this.openid = value
      }
    } catch (e) {
      console.log('获取openid失败')
    }
    this.opunionpaymakeorder(42, bid, 1, this.payAmount, attach)
  },
  methods: {
    choose () {
      this.active = !this.active
      this.btnLight = !this.btnLight
    },
    // 微信支付配置参数
    opgetconfigwechatpayxcx () {
      let that = this
      var param = {}
      const opgetconfigwechatpayxcx = api.opgetconfigwechatpayxcx(param)
      opgetconfigwechatpayxcx.then(d => {
        if (d.code === 200) {
          that.configwechatpay = d.data
          console.log(that.configwechatpay)
        }
      })
      .catch((e) => {
        console.log(e)
      })
    },
    // 生成交易记录
    opunionpaymakeorder (tradeMethods, bid, bgenre, price, attach) {
      var param = {}
      param['trade_methods'] = tradeMethods
      param['bid'] = bid
      param['price'] = price
      param['attach'] = attach
      const opunionpaymakeorder = api.opunionpaymakeorder(param)
      opunionpaymakeorder.then(d => {
        if (d.code === 200) {
          this.unionpaymakeorder = d.data
          console.log(this.unionpaymakeorder)
          this.opUnionpay(this.unionpaymakeorder.trade_no, this.payAmount, '租客账单支付', '127.0.0.1', attach, 2, 42, 'https://fhxxg.fanglilai.cn/apii/paynotify/notifyWechatpay', this.openid)
        }
      })
      .catch((e) => {
        console.log(e)
      })
    },
    // 统一下单
    opUnionpay (outTradeNo, totalFee, body, spbillCreateIp, attach, isFwh, tradeMethods, notifyUrl, subOpenid) {
      var param = {}
      param['trade_conf_no'] = 2
      param['out_trade_no'] = outTradeNo
      param['total_fee'] = parseFloat(parseFloat(totalFee) * 100)
      param['body'] = body
      param['spbill_create_ip'] = spbillCreateIp
      param['attach'] = attach
      param['is_fwh'] = isFwh
      param['trade_methods'] = tradeMethods
      param['notify_url'] = notifyUrl
      param['sub_openid'] = subOpenid
      const opUnionpay = api.opUnionpay(param)
      opUnionpay.then(d => {
        if (d.code === 200) {
          this.unionPay = d.data
          console.log(this.unionPay)
        }
      })
      .catch((e) => {
        console.log(e)
      })
    },
    // 产生随机数
    randomString () {
      var chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678'
      var maxPos = chars.length
      var pwd = ''
      for (var i = 0; i < 32; i++) {
        pwd += chars.charAt(Math.floor(Math.random() * maxPos))
      }
      return pwd
    },
    // 调起支付API
    toPay () {
      let that = this
      let timeStamp = parseInt(new Date().getTime() / 1000) + ''
      let nonceStr = that.randomString()
      var stringSignTemp = 'appId=wx499071f5a76964f0&nonceStr=' + nonceStr + '&package=prepay_id=' + that.unionPay.prepay_id + '&signType=MD5&timeStamp=' + timeStamp + '&key=' + that.configwechatpay.key
      var sign = md5(stringSignTemp).toUpperCase()
      wx.requestPayment({
        'timeStamp': timeStamp,
        'nonceStr': nonceStr,
        'package': 'prepay_id=' + that.unionPay.prepay_id,
        'signType': 'MD5',
        'paySign': sign,
        'success': function (res) {
          setTimeout(function () {
            wx.navigateBack()
          }, 1000)
        },
        'fail': function (res) {
          console.log('失败')
        },
        'complete': function (res) {
          console.log('完成')
        }
      })
    }
  }
}
</script>

<style lang="css">
  @import "./bill_pay.css";
</style>
